<div id="wrapper">
  <div id="left-column">
    <h1>Posts</h1>
    <<div id="posts">
      <% @posts.each do |post| %>
        <%= render post %>
        <p>
          <%= link_to "Show this post", post %>
        </p>
      <% end %>
    </div>
    <%= link_to "New post", new_post_path %>
  </div>
  <div id="right-column">
    <h2>Welcome my blog</h2>
    <%# <% link_to "www.bilibili.com"%> %>
    <!-- 在这里添加您想要显示的内容 -->
  </div>
</div>

<style>
  #wrapper {
    width: 100%;
    overflow: hidden;
    background-color: #f2f2f2; /* 设置背景色 */
  }
  #left-column {
    width: 50%;
    float: left;
    background-color: linear-gradient(to bottom, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%); /* 设置左侧背景色 */
    color: pink; /* 设置字体颜色 */
    padding: 20px; /* 设置内边距 */
    box-shadow: 0 0 10px rgba(0,0,0,0.2); /* 设置阴影效果 */
  }
  #right-column {
    width: 30%;
    float: right;
    background-color: linear-gradient(to bottom, #87e0fd 0%,#53cbf1 40%,#05abe0 100%); /* 设置右侧背景色 */
    color: #333; /* 设置字体颜色 */
    padding: 20px; /* 设置内边距 */
    box-shadow: 0 0 10px rgba(0,0,0,0.2); /* 设置阴影效果 */
    animation: slide-in 1s ease-out; /* 设置动画效果 */
  }
  @keyframes slide-in {
    from {
      transform: translateX(100%);
    }
    to {
      transform: translateX(0);
    }
  }
</style>
